// dayjs  moment
// 1:下载  yarn add moment
// 2:导入  import moment form 'moment'
// 3:转换  moment(时间).format('YYYY-MM-DD')
import moment from 'moment'
import employees from '@/api/constant/employees'
function changeFn(dom, obj) {
  const findItem = employees[obj.arg].find((item) => +item.id === +obj.value)
  dom.innerText = findItem ? findItem.value : '-'
}
let fn = () => {}
const obj = {
  imgerror: {
    inserted(dom, obj) {
      // 如果img有src就使用它自己的src,没有就使用默认图片
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
      // 图片加载出错的处理
      dom.onerror = () => {
        dom.src = obj.value || require('@/assets/common/head.jpg')
      }
    },
    componentUpdated(dom) {
      // 考虑更新问题
      dom.src = dom.src || obj.value || require('@/assets/common/head.jpg')
    }
  },
  abc: {},
  ooo: {},
  // 需求：点击某dom区域外执行某事件
  clickOut: {
    /*
         bind:绑定时，类似beforeMount
         inserted:渲染后，类似mounted
         update:更新时，
         componentUpdated:更新后，类似updated
         unbind:解绑，销毁后，类似destroyed
      */
    inserted(dom, obj, vnode) {
      // obj:{属性，修饰符，值value}
      fn = (e) => {
        // 判断点击的dom是否在盒子内
        // 点击的dom:e.target
        // 盒子的dom:dom
        // boolean=dom.contains(e.target)
        if (dom.contains(e.target)) {
          // console.log('包含')
        } else {
          // console.log('不包含')
          obj.value()
        }
      }
      document.addEventListener('click', fn)
    },
    unbind() {
      document.removeEventListener('click', fn)
    }
  },
  // 需求：自定义指令解决时间转换
  formatTime: {
    /*
         bind:绑定时，类似beforeMount
         inserted:渲染后，类似mounted
         update:更新时，
         componentUpdated:更新后，类似updated
         unbind:解绑，销毁后，类似destroyed
      */
    inserted(dom, obj, vnode) {
      dom.innerText = moment(obj.value).format('YYYY-MM-DD')
    },
    componentUpdated(dom, obj) {
      dom.innerText = moment(obj.value).format('YYYY-MM-DD')
    }
  },
  // 需求：自定义指令转换聘用形式
  formatType: {
    inserted(dom, obj) {
      // console.log(obj)
      changeFn(dom, obj)
    },
    componentUpdated(dom, obj) {
      changeFn(dom, obj)
    }
  }

  //   qqq: {}
}
export default {
  install(Vue) {
    for (const key in obj) {
      Vue.directive(key, obj[key])
    }
  }
}
